<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
  <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css"> -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.css">
  <style>
    .test {
      width: 1200px;
      margin: 0 auto;
      padding: 20px 0;
    }

    .title {
      margin: 20px 0;
    }

    pre {
      padding: 55px 20px 20px 20px;
      box-sizing: border-box;
      max-height: 300px;
      overflow-y: auto;
      position: relative;
    }

    .copy_btn {
      position: absolute;
      left: 20px;
      top: 10px;
    }

    textarea {
      width: 100%;
      height: 300px;
    }
  </style>
</head>

<body>
  <div class="test">
    <h2 class="title is-2">0、默认答一次题目（复制下方代码粘贴到控制台运行）</h2>
    <pre><code class="language-javascript">const setAnswerByLocalData = (data) => {
      let answer = [];
      const box = document.querySelectorAll(".question-item");
      if (data) {
        answer = data;
      } else {
        answer = localStorage.getItem("answer")
          ? JSON.parse(localStorage.getItem("answer"))
          : [];
      }
      for (let i = 0; i < box.length; i++) {
        let radio = box[i].querySelectorAll(".ant-radio-wrapper");
        let checkbox = box[i].querySelectorAll(".ant-checkbox-wrapper");
        if (radio && radio.length > 0) {
          radio.forEach((item) => {
            let value = item.querySelectorAll("input")[0].value;
            if (answer[i].indexOf(value) > -1) {
              item.click();
            }
          });
        } else {
          checkbox.forEach((item) => {
            let value = item.querySelectorAll("input")[0].value;
            if (answer[i].indexOf(value) > -1) {
              (function (item) {
                setTimeout(() => {
                  item.click()
                }, 1000)
              })(item)
            }
          });
        }
      }
    };

    let data = [
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C"
      ],
      [
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C"
      ],
      [
        "A",
        "C",
        "D"
      ],
      [
        "C"
      ],
      [
        "A"
      ],
      [
        "C"
      ],
      [
        "D"
      ],
      [
        "C"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "D"
      ],
      [
        "A"
      ],
      [
        "D"
      ],
      [
        "B"
      ],
      [
        "C"
      ],
      [
        "A"
      ],
      [
        "A"
      ]
    ];
    setAnswerByLocalData(data);</code></pre>

    <h2 class="title is-2">1、粘贴findPaperDetails返回的接口数据</h2>
    <textarea class="textarea" id="api">[
    {
        "ext": {},
        "intMap": {},
        "score": 2,
        "strList": [],
        "strMap": {
            "answerTime": "14478",
            "title": "安全、保密、日常行为规范测试（2024.2）"
        },
        "uuid": "00121A4600024138B26C08D2A3FBA215",
        "zjsbbTestOptionList": [
            {
                "ext": {},
                "intMap": {},
                "strList": [],
                "strMap": {},
                "uuid": "144FA935436046F58ED303517173B3A3",
                "zjsbbtoOptionText": "A",
                "zjsbbtoOptionValue": "正确",
                "zjsbbtoUuid": "144FA935436046F58ED303517173B3A3"
            },
            {
                "ext": {},
                "intMap": {},
                "strList": [],
                "strMap": {},
                "uuid": "2046EDEE618445C192002DF0A0CAB82D",
                "zjsbbtoOptionText": "B",
                "zjsbbtoOptionValue": "错误",
                "zjsbbtoUuid": "2046EDEE618445C192002DF0A0CAB82D"
            }
        ],
        "zjsbbprAnswerScore": "2",
        "zjsbbprOptionKey": "2046EDEE618445C192002DF0A0CAB82D",
        "zjsbbprUuid": "E14EA02B4C764C749A5DDA803754730D",
        "zjsbbtsAnalysis": "“记住密码xxxxx造成信息xxx慎使用。",
        "zjsbbtsQuestionType": "安全、xxxx常行为规范202402",
        "zjsbbtsRight": "B",
        "zjsbbtsRightKey": "2046EDEE618445C192002DF0A0CAB82D",
        "zjsbbtsSubject": "小王驻场xxxx登录模式。为确保安全，他的做法是否正确（   ）。",
        "zjsbbtsType": "3",
        "zjsbbtsUuid": "00121A4600024138B26C08D2A3FBA215"
    }
]</textarea>
    <h2 class="title is-2">2、点击解析按钮</h2>
    <button class="button is-primary" id="btn_jx">解析</button>
    <h2 class="title is-2">3、复制最终代码 粘贴到控制台</h2>
    <!-- <textarea class="textarea" id="result"> </textarea> -->
    <pre id="result"><code class="language-javascript hljs" ></code></pre>

  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
  <script>
    hljs.highlightAll();
  </script>
  <script>
    const setAnswerByLocalData = (data) => {
      let answer = [];
      const box = document.querySelectorAll(".question-item");
      if (data) {
        answer = data;
      } else {
        answer = localStorage.getItem("answer")
          ? JSON.parse(localStorage.getItem("answer"))
          : [];
      }
      for (let i = 0; i < box.length; i++) {
        let radio = box[i].querySelectorAll(".ant-radio-wrapper");
        let checkbox = box[i].querySelectorAll(".ant-checkbox-wrapper");
        if (radio && radio.length > 0) {
          radio.forEach((item) => {
            let value = item.querySelectorAll("input")[0].value;
            if (answer[i].indexOf(value) > -1) {
              item.click();
            }
          });
        } else {
          checkbox.forEach((item) => {
            let value = item.querySelectorAll("input")[0].value;
            if (answer[i].indexOf(value) > -1) {
              (function (item) {
                setTimeout(() => {
                  item.click()
                }, 1000)
              })(item)
            }
          });
        }
      }
    };

    let data = [
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "A"
      ],
      [
        "B"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C",
        "D"
      ],
      [
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C"
      ],
      [
        "C",
        "D"
      ],
      [
        "A",
        "B",
        "C"
      ],
      [
        "A",
        "C",
        "D"
      ],
      [
        "C"
      ],
      [
        "A"
      ],
      [
        "C"
      ],
      [
        "D"
      ],
      [
        "C"
      ],
      [
        "B"
      ],
      [
        "B"
      ],
      [
        "A"
      ],
      [
        "D"
      ],
      [
        "A"
      ],
      [
        "D"
      ],
      [
        "B"
      ],
      [
        "C"
      ],
      [
        "A"
      ],
      [
        "A"
      ]
    ];
    // setAnswerByLocalData(data);
    document.getElementById("btn_jx").onclick = function () {
      //解析返回数据
      let res_data = document.getElementById("api").value;
      let right_arr = []
      JSON.parse(res_data).forEach(e => {
        console.log(e);
        //正确选项的逻辑为 当前遍历元素e中的 zjsbbprOptionKey值(多个,分割) 在 zjsbbTestOptionList中对应的uuid值
        // let right_key_arr = e.zjsbbprOptionKey.split(",");
        // let right_arr_item = [];
        // e.zjsbbTestOptionList.forEach(item => {
        //   if (right_key_arr.indexOf(item.uuid) > -1) {
        //     right_arr_item.push(item.zjsbbtoOptionText);
        //   }
        // })
        // right_arr.push(right_arr_item);
        right_arr.push(e.zjsbbtsRight);
      });
      let result_text = `
      let right=${JSON.stringify(right_arr)}

      const setAnswerByLocalData = ${setAnswerByLocalData}

      setAnswerByLocalData(right);
      `;
      document.querySelector("#result code").innerText = result_text;
      alert('解析成功')
      // 取消之前的高亮设置
      // document.querySelector("#result code").dataset.highlighted = false;
      // 重新应用高亮样式
      // setTimeout(() => {
      //   hljs.highlightElement(document.querySelector("#result code"));
      // }, 500);
    };



    // 优化体验类
    function loadScript(src, callback) {
      var script = document.createElement('script'),
        head = document.getElementsByTagName('head')[0];
      script.type = 'text/javascript';
      script.charset = 'UTF-8';
      script.src = src;
      if (!callback) callback = function () { };
      if (script.addEventListener) {
        script.addEventListener('load', function () {
          callback();
        }, false);
      } else if (script.attachEvent) {
        script.attachEvent('onreadystatechange', function () {
          var target = window.event.srcElement;
          if (target.readyState == 'loaded') {
            callback();
          }
        });
      }
      head.appendChild(script);
    }
    //寻找所有code标签，加复制按钮鸭！ 
    var codes = document.getElementsByTagName('code');
    if (codes.length) {
      for (var i = 0; i < codes.length; i++) {
        var code_id = "code_id_" + i;
        var btn = document.createElement("button");
        btn.setAttribute("class", "button copy_btn");
        // btn.setAttribute("class", "button");
        btn.setAttribute("data-clipboard-target", "#" + code_id);
        codes[i].setAttribute("id", code_id);
        btn.innerHTML = '复制代码';
        codes[i].parentNode.insertBefore(btn, codes[i]);
      }
      loadScript("https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js", function () {
        var cop = new ClipboardJS('.copy_btn');
        cop.on('success', function (e) {
          // layer.msg("复制成功");
          console.log('复制成功');
          alert('复制成功')
          e.clearSelection();
        });
        cop.on('error', function (e) {
          // layer.msg("复制失败了，但是已经全选了惹...手动复制吧勇士！");
          console.log("复制失败了，但是已经全选了惹...手动复制吧勇士！");
          alert('复制失败了，但是已经全选了惹...手动复制吧勇士！')
        });
      });
    }
  </script>
</body>

</html>